
.night {
  background: #2A2D3C;
  ::v-deep .dashboard-editor-container {
  background-color: #2a2d3c !important;


  }
  ::v-deep .dashboard-editor-container.home-container{
    background-color: #303445 !important;
  }
  .content {
    background: #363b4d !important;
    border: 1px solid #363b4d !important;
  }


  // 树结构
  ::v-deep .el-tree {
    color: #D0D0D3;
    background: #303445;

    .el-tree-node__content:hover {
      background: #2a2d3c;
      color: #fff;
    }
    .el-tree__empty-block{
      background: #303445 !important;
    }
  }

  ::v-deep .ssb-eh__close {
    background: #474B61 !important;
    border: 1px solid #565865 !important;
    color: #c3c3c7 !important;
  }

  ::v-deep .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
    margin: 1px;
    background: #2a2d3c !important;
    color: #fff;
  }
  ::v-deep .el-tree .el-tree-node__content:hover{
    margin: 1px;
  }
  ::v-deep .el-divider {
    background-color: #606266;
  }

  // 分页总数
  ::v-deep .el-pagination__total {
    color: #B7B8BC;
  }

  ::v-deep .el-pagination__jump {
    color: #B7B8BC;
  }


  // 表格样式
  ::v-deep .el-table {
    background-color: #303445;
    border-top: none;
    border-right: none;
    border: none !important;

    // border-left: 1px solid #5a6675;
    .el-button--primary {
      border-color: #21B6DC !important;
      background-color: #21B6DC !important;

      &:hover {
        background-color: #48bedc !important;
      }
    }
  }

  ::v-deep .el-table th {
    font-weight: 400;
    color: #fefefe;
    border-bottom: none !important;
    background: #3E4252 !important;
  }

  ::v-deep .el-table__header-wrapper {
    background-color: #000 !important;
  }

  ::v-deep .el-table tr {
    color: #B7B8BC !important;
    background-color: #303445 !important;
  }

  // 去除实时监控->实时流量->表格底部有黑线
  ::v-deep .el-table::before {
    height: 0;
  }

  // 下外边框
  ::v-deep .el-table--border::after,
  .el-table--group::after,
  .el-table::before {
    background-color: #5a6676;
  }

  ::v-deep .el-table__fixed-right::before,
  .el-table__fixed::before {
    background-color: #5a6676;
  }

  ::v-deep .el-table td.el-table__cell,
  .el-table th.el-table__cell.is-leaf {
    border-bottom: none;
  }

  // 内边框
  ::v-deep .el-table--border .el-table__cell,
  ::v-deep .el-table__body-wrapper .el-table--border.is-scrolling-left~.el-table__fixed {
    // border: 1px solid #5A6676;
    // border: none;
    border-right: none;
  }

  ::v-deep .el-table__body tr.current-row>td.el-table__cell,
  ::v-deep .el-table__body tr.selection-row>td.el-table__cell {
    background: #5a6676;
  }

  // 内边框
  ::v-deep .el-table--border .el-table__cell,
  .el-table__body-wrapper .el-table--border.is-scrolling-left~.el-table__fixed {
    // border: 1px solid #474D63;
    // border: none;
    border-right: none;
  }

  // 斑马线
  ::v-deep .el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell {
    background: #35394a;
  }

  ::v-deep .el-table--striped .el-table__body tr.el-table__row--striped.current-row td.el-table__cell,
  ::v-deep .el-table--striped .el-table__body tr.el-table__row--striped.selection-row td.el-table__cell {
    background: #343745;
  }

  ::v-deep .el-table__body tr.hover-row>td.el-table__cell:not(.tr.selection-row) {
    background: #343745;
  }

  ::v-deep .el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell {
    background: #343745;
  }

  ::v-deep .el-table__body tr.hover-row>td.el-table__cell {
    background: #343745;
  }

  ::v-deep .el-table__fixed-right {
    // border-right: 1px solid #474D63;
    border-bottom: none;
  }

  ::v-deep .el-table::before, .el-table--group::after, .el-table--border::after{
    background:#000;
  }
  ::v-deep .el-table__fixed-right::before, .night .el-table__fixed::before{
    background:#000;
  }

  // 表格无数据占位符
  ::v-deep .el-table__empty-block {
    background-color: #2a2d3c;
    margin-top: 0;
    border-left: none;

  }
  ::v-deep .el-table__body-wrapper{
    background-color: #2a2d3c;

    }


  // 修改分页样式
  // 未选中样式
  ::v-deep .el-pagination.is-background .el-pager li:not(.disabled) {
    background-color: #303445; // 进行修改未选中背景和字体
    color: #FFFFFF;
    border: 1px solid #3F4456;
    border-radius: 3px;
    min-width: 32px;
    height: 32px;
    line-height: 32px;
  }


  // 鼠标经过颜色
  ::v-deep .el-pagination.is-background .el-pager li:not(.disabled):hover {
    color: #FFFFFF;
  }

  // 上一页下一页样式
  ::v-deep .el-pagination.is-background .btn-next {
    background-color: #3F4456; // 进行修改未选中背景和字体
    color: #FFFFFF;
    border: 1px solid #3F4456;
    border-radius: 3px;
    min-width: 32px;
    height: 32px;
    line-height: 32px;
  }

  ::v-deep .el-pagination.is-background .btn-prev {
    background-color: #3F4456; // 进行修改未选中背景和字体
    color: #FFFFFF;
    border: 1px solid #3F4456;
    border-radius: 3px;
    min-width: 32px;
    height: 32px;
    line-height: 32px;
  }

  ::v-deep .el-pagination button,
  ::v-deep .el-pagination span:not([class*=suffix]) {
    height: 36px;
    line-height: 36px;
  }

  // 总数样式
  ::v-deep .el-pagination__total,
  ::v-deep .el-pagination__jump {
    height: 32px;
    line-height: 32px;
    color: #FFFFFF;
  }

  // 每页条数样式
  ::v-deep .el-pagination .el-select .el-input .el-input__inner {
    height: 32px;
    color: #FFFFFF;
    background: #303445;
    border: 1px solid #3F4456;
  }

  // 跳页样式
  ::v-deep .el-pagination__editor.el-input .el-input__inner {
    height: 32px;
    color: #FFFFFF;
    background: #303445;
    border: 1px solid #3F4456;
  }

  // 选中页的样式
  ::v-deep .el-pagination.is-background .el-pager li:not(.disabled).active {
    background-color: #1890FF;
    border: 1px solid #1890FF;
  }

  ::v-deep .el-date-editor .el-range-input {
    background-color: #303445 !important;
    color: #ccc !important;
  }

  ::v-deep .el-date-editor .el-range-separator {
    color: #fff;
  }



  // 弹窗
  ::v-deep .el-dialog .el-dialog__header {
    background: #3E4252;
  }

  ::v-deep .el-dialog__body {
    padding: 30px 20px 10px 20px;
    background: #303445;
    color:#fff;
    .el-input__inner {
      background-color: #303445 !important;
      color: #96979d;
      border: 1px solid #414556;
    }
  }

  ::v-deep .el-dialog__footer {
    background: #303445;

  }

  ::v-deep .el-form-item__label {
    color: #FFFFFF;
  }

  ::v-deep .el-button--primary {
    background-color: #1890FF;
    border: 1px solid #1890FF;

    &:hover {
      background-color: #369eff;
    }
  }

  ::v-deep .el-button--info {
    background-color: #606474;
    border: 1px solid #606474;

    &:hover {
      background-color: #727379;
    }
  }

  .button-primary {
    background-color: #21B6DC;
    border: 1px solid #21B6DC;

    &:hover {
      background-color: #48bedc;
    }
  }

  .button-success {
    background-color: #7CD74E;
    border: 1px solid #7CD74E;

    &:hover {
      background-color: #89d463;
    }
  }

  ::v-deep .el-upload--picture-card {
    background-color: #303445;
  }


  ::v-deep .el-button--info {
    background-color: #606474;
    border: 1px solid #606474;

    &:hover {
      background-color: #727379;
    }
  }


  ::v-deep .el-tabs--border-card {
    border: 1px solid #2A2D3C;
  }

  // 顶部样式
  ::v-deep .el-tabs__nav-scroll {
    margin: 0 auto;
    background-color: #293748;
    background: #3e4252;
    border: none;
  }

  // 选中样式
  ::v-deep .el-tabs--border-card>.el-tabs__header .el-tabs__item.is-active {
    background-color: none;
    background: #303445;
    color: #B7B8BC;
    border: none;
  }

  ::v-deep .el-tabs--border-card>.el-tabs__header .el-tabs__item:not(.is-disabled):hover {
    color: #2d92f9;
    border: none;
  }

  ::v-deep .el-tabs--border-card > .el-tabs__header{
    border-bottom: 1px solid #5a6676;
  }


  ::v-deep .el-tabs--border-card>.el-tabs__content {
    background: #303445;
    border: 1px solid #303445;
    padding: 0;
  }

  ::v-deep .el-tabs--border-card {
    border: 1px solid #2A2D3C;
  }

  // el-descriptions样式
  ::v-deep .el-descriptions-item__label.is-bordered-label {
    color: #fff;
    background: #2B2E3E;
    border: 1px solid #303445;
  }

  ::v-deep .el-descriptions-item__content {
    color: #fff;
    background: #3B3F50;
    border: 1px solid #303445;
  }

  ::v-deep .el-button--info {
    background-color: #606474;
    border: 1px solid #606474;

    &:hover {
      background-color: #727379;
    }
  }

  // 多选框样式
  ::v-deep .el-select-dropdown,
  .el-popper {
    color: white;
    background: #000 !important;
    border: 1px solid #000 !important;
  }

  // 日期选择框样式
  ::v-deep .el-range-editor--small.el-input__inner {
    color: white;
    background-color: #314054;
    border: none;
  }

  ::v-deep .el-date-table td.disabled div {
    background: #1b2532;
  }

  ::v-deep .el-range-editor--small.el-input__inner:not(:placeholder-shown) {
    color: white;
    background-color: #314054;
  }

  ::v-deep .el-date-editor .el-range-input::placeholder {
    color: #5A6676;
    /* placeholder颜色 */
  }

  ::v-deep .el-date-editor .el-range-separator {
    color: #FFFFFF;
  }

  ::v-deep .el-picker-panel [slot=sidebar],
  ::v-deep .el-picker-panel__sidebar {
    background-color: #324053;
    border-right: 1px solid #5a6675;
  }

  ::v-deep .el-picker-panel__shortcut {
    color: #FFFFFF;
  }

  ::v-deep .el-picker-panel__shortcut:hover {
    color: #0ECB92;
  }

  ::v-deep .el-picker-panel {
    color: #FFFFFF;
    border: 1px solid #5a6675;
    background-color: #314054;

    .available {
      color: #fff;
    }

    .el-date-table td.available:hover {
      color: #0ECB92;
    }

    .el-date-editor .el-range-input {
      color: #fff;
    }

    .el-date-range-picker__time-header {
      border-bottom: 1px solid #5a6675;

      .el-input--small .el-input__inner {
        border: 1px solid #5a6675;
      }
    }

    .el-date-range-picker__time-header>.el-icon-arrow-right {
      color: #FFFFFF;
    }

    .el-date-range-picker__content.is-left {
      border-right: #5a6675;
    }

    .el-date-table td.today span {
      color: #0ECB92;
    }

    .el-date-range-picker__editor {
      color: #FFFFFF;
    }

    .el-picker-panel__icon-btn {
      color: #FFFFFF;
    }

    .el-date-table td.in-range div,
    .el-date-table td.in-range div:hover,
    .el-date-table.is-week-mode .el-date-table__row.current div,
    .el-date-table.is-week-mode .el-date-table__row:hover div {
      background-color: #1b2532;
    }

    .el-date-table td.end-date span,
    .el-date-table td.start-date span {
      background-color: #0ECB92;
      color: #FFFFFF;
    }

    .el-picker-panel__footer {
      border-top: 1px solid #5a6675;
      background-color: #314054;
    }

    .el-date-table th {
      color: #fff;
      border-bottom: 1px solid #5a6675;
    }

    .el-button.is-disabled.is-plain,
    .el-button.is-disabled.is-plain:hover,
    .el-button.is-disabled.is-plain:focus {
      background-color: #1b2532;
      border: none;
      color: #FFFFFF;
    }

    .el-button.is-plain,
    .el-button.is-disabled.is-plain:hover,
    .el-button.is-disabled.is-plain:focus {
      background-color: #21cb93;
      border: none;
      color: #FFFFFF;
    }
  }


  .el-progress-wrap {
    display: flex;
    align-items: center;

    ::v-deep .el-progress {
      width: calc(100% - 120px);
      display: flex;
    }

    ::v-deep .el-progress__text {
      width: 80px;
      color: #FFFFFF !important;
      font-size: 14px !important;
    }

    .el-progress-num {
      width: 120px;
    }
  }

  .popper__arrow::after {
    color: #1b2532 !important;
    border-bottom-color: #1b2532 !important;
    border-top-color: #1b2532 !important;
  }

  .el-input--small .el-input__inner {
    color: white !important;
    background-color: #314054 !important;
  }

  .el-scrollbar {
    background-color: #2a2d3c;
    color: white;
    border: 1px solid #2a2d3c;

    .el-time-spinner__item {
      color: white;
    }

    .el-time-spinner__item.active:not(.disabled) {
      color: #1890ff;
    }

    .el-time-spinner__item:hover:not(.disabled):not(.active) {
      background-color: #303445;
    }

    .el-select-dropdown__item.hover,
    .el-select-dropdown__item:hover {
      background-color: #303445;

    }

    .el-select-dropdown__item {
      color: #fff;
    }

    .el-select-dropdown__item.selected {
      color: #1890ff;
    }

  }

  .el-select-dropdown {
    border: 1px solid #303445;
  }



 // 级联框
  ::v-deep .el-cascader-menu {
    color: white !important;
    border-right: solid 0px #E4E7ED !important;
  }
  ::v-deep .el-cascader-menu__wrap{
    background: #5a6676 !important;
  }
  [class*=" el-icon-"], [class^=el-icon-]{
    color: white !important;
  }
  ::v-deep .el-popper[x-placement^=bottom] {
    border: none !important;
  }
  ::v-deep .el-cascader-node.in-active-path, .el-cascader-node.is-active, .el-cascader-node.is-selectable.in-checked-path{
    color: white !important;
  }
  ::v-deep .el-cascader-node__label{
    color: white !important;
  }
  ::v-deep .el-cascader-node:not(.is-disabled):focus, .el-cascader-node:not(.is-disabled):hover{
    background: linear-gradient(180deg, #2B425F 0%, rgba(50, 75, 107, 0.35) 100%) !important;
    // color: white;
  }

  ::v-deep .el-scrollbar__wrap{
    background: #2e3242 !important;
  }
  ::v-deep .el-cascader__suggestion-list{
    background: #243243 !important;
    color: #fff !important;
  }
  ::v-deep .el-cascader__suggestion-item:focus, .el-cascader__suggestion-item:hover{
    background: linear-gradient(180deg, #2B425F 0%, rgba(50, 75, 107, 0.35) 100%) !important;
  }

  ::v-deep .el-input-group__append, .el-input-group__prepend{
    background-color: #3e4252;
    border: 1px solid #414556;
  }

  ::v-deep .el-textarea__inner{
    color: white !important;
    border: 1px solid #243244;
    background-color: #3e4252 !important;
  }

  ::v-deep .el-row {
    background: #303445 !important;
    margin: 0 0 !important;

  }



  ::v-deep .el-form-row{
    background: #303445 !important;
  }
  .box{
    background: #303445 !important;
  }
  ::v-deep .el-tree-wrap{
    .content{
      border: none !important;
      box-shadow: none !important;
    }
  }



  .title {
    color: #FFFF;
  }

  .parameType {
    color: #B7B8BC;
    border: 1px solid #3F4456;
    box-shadow: 0 0 10px #3F4456;

    .title {
      border-bottom: 1px solid #3F4456;
    }
  }


  .content {
    background-color: #363b4d !important;
    color: #D0D0D3;
  }

  .box {
    background: #363b4d !important;
    border: none !important;
  }

  ::v-deep .tabclick :hover {
    background: #474b60 !important;
  }

  ::v-deep .tabitem {
    border: 1px solid #565865 !important;
    background: #474B61 !important;

    i {
      color: #FFFFFF !important;
    }

    &:hover {
      background: #525563 !important;
    }
  }




  /* 整个滚动条的样式 */
  ::-webkit-scrollbar {
    width: 8px;
    /* 滚动条的宽度 */
    height: 8px;
    /* 滚动条的高度 */
  }

  /* 滚动条轨道的样式 */
  ::-webkit-scrollbar-track {
    background: #292c3b;
    /* 轨道的颜色 */
  }

  /* 滚动条滑块的样式 */
  ::-webkit-scrollbar-thumb {
    background: #888;
    /* 滑块的颜色 */
    border-radius: 6px;
    /* 滑块的圆角 */
  }

  /* 当鼠标悬停在滑块上时的样式 */
  ::-webkit-scrollbar-thumb:hover {
    background: #555;
    /* 悬停时的颜色 */
  }



  //对话框Dialog的input旁边的字体颜色
  .Dialog-title{
      color: #fff !important;
    }

  ::v-deep .el-card {
    border: 1px solid #3F4456;
  }

  ::v-deep .el-card__header {
    color: #ffffff;
    border: 1px solid #3F4456;
    background: #2a2d3c;
  }

  ::v-deep .el-card__body {
    color: #ffffff;
    border: 1px solid #3F4456;
    background: #2a2d3c;
  }

}

::v-deep .el-dialog__body {
  padding: 30px 20px 10px 20px !important;
}








